<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

    <!-- Bootstrap -->
    <link href="./bootstrap-3.3.7/css/bootstrap.css" rel="stylesheet">
    <link href="./bootstrap-3.3.7/css/bootstrap-switch.css" rel="stylesheet">

    <!-- iCheck -->
    <link href="./icheck/skins/all.css" rel="stylesheet">

    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="./js/jquery-1.12.4.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="./bootstrap-3.3.7/js/bootstrap.js"></script>
    <script src="./bootstrap-3.3.7/js/bootstrap-switch.js"></script>
    <script src="./icheck/icheck.js"></script>

    <script>
        $(function(){
            $("[name='my-checkbox']").bootstrapSwitch();

            $('input').iCheck({
                checkboxClass: 'icheckbox_square',
                radioClass: 'iradio_square',
                increaseArea: '20%' // optional
            });
        });
    </script>
</head>
<body>
    <h1>你好，世界！</h1>

    <!-- <input type="checkbox" name="my-checkbox" checked> -->

    <input type="checkbox">
    <input type="checkbox" checked>
    <input type="radio" name="iCheck">
    <input type="radio" name="iCheck" checked>

</body>
</html>